<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="报价单号" prop="orderCode">
        <el-input
          v-model="queryParams.orderCode"
          placeholder="请输入报价单号"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="询价单号" prop="inquireCode">
        <el-input
          v-model="queryParams.inquireCode"
          placeholder="请输入询价单号"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="比价单号" prop="priceComparisonCode">
        <el-input
          v-model="queryParams.priceComparisonCode"
          placeholder="请输入比价单号"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="物流方式" prop="logisticsModule">
        <el-select v-model="queryParams.logisticsModule" placeholder="请选择物流方式" clearable>
          <el-option
            v-for="dict in dict.type.wms_logistics"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="是否物流" prop="ifLogistics">
        <el-select v-model="queryParams.ifLogistics" placeholder="请选择" clearable>
          <el-option
            v-for="dict in dict.type.sys_yes_no"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="状态" prop="status">
        <el-select v-model="queryParams.status" placeholder="请选择状态" clearable>
          <el-option
            v-for="dict in dict.type.wms_logistics_order_status"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>

    <el-row :gutter="10" class="mb8">
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>

    <el-table v-loading="loading" :data="offerOrderList">
      <el-table-column type="index" width="55" align="center" />
      <el-table-column type="expand">
        <template slot-scope="props">
          <el-form label-position="left" inline class="demo-table-expand">
            <el-row :gutter="10">
              <el-col :span="12">
                <el-form-item label="支付方式">
                  <dict-tag :options="dict.type.wms_pay_type" :value="props.row.payType"/>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="通知方式">
                  <dict-tag :options="dict.type.wms_order_notice_type" :value="props.row.noticeType"/>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="10" v-if="props.row.ifLogistics === 'Y'">
              <el-col :span="12">
                <el-form-item label="物流方式">
                  <dict-tag :options="dict.type.wms_logistics" :value="props.row.logisticsModule"/>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="物流条款">
                  <span>{{ props.row.logisticsTerms }}</span>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="10" v-if="props.row.ifLogistics === 'Y'">
              <el-col :span="12">
                <el-form-item label="运费">
                  <span>{{ props.row.freight }}</span>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="保险费">
                  <span>{{ props.row.safe }}</span>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="10">
              <el-col :span="12">
                <el-form-item label="杂费">
                  <span>{{ props.row.ext }}</span>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="交货期">
                  <span>{{ props.row.jhValid }}</span>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="10" v-if="props.row.payType === '1'">
              <el-col :span="12">
                <el-form-item label="先款比例">
                  <span>{{ props.row.prefixPayRate }}</span>
                  <span style="margin-left: 10px">备注：{{props.row.prefixRemark}}</span>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="进度款比例">
                  <span>{{ props.row.processPayRate }}</span>
                  <span style="margin-left: 10px">备注：{{props.row.processRemark}}</span>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="10" v-if="props.row.payType === '1'">
              <el-col :span="12">
                <el-form-item label="尾款比例">
                  <span>{{ props.row.tailPayRate }}</span>
                  <span style="margin-left: 10px">备注：{{props.row.tailRemark}}</span>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="尾款支付时间">
                  <span>货到后{{ props.row.tailPayTime }}天付款</span>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
        </template>
      </el-table-column>
      <el-table-column label="报价单号" align="center" prop="orderCode">
        <template slot-scope="scope">
          <el-link type="primary" @click="handleLook(scope.row)">{{ scope.row.orderCode }}</el-link>
        </template>
      </el-table-column>
      <el-table-column label="询价单编码" align="center" prop="inquireCode" />
      <el-table-column label="比价单编码" align="center" prop="priceComparisonCode" :show-overflow-tooltip="true"/>
      <el-table-column label="是否物流" align="center" prop="ifLogistics">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.sys_yes_no" :value="scope.row.ifLogistics"/>
        </template>
      </el-table-column>
      <el-table-column label="利润比例" align="center" prop="ratio" />
      <el-table-column label="订单总价" align="center" prop="allPrice" />
      <el-table-column label="报价时间" align="center" prop="offerTime" width="130">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.offerTime, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
      <el-table-column label="有效期" align="center" prop="valid" width="130">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.valid, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
      <el-table-column label="状态" align="center" prop="status">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.wms_logistics_order_status" :value="scope.row.status" v-if="scope.row.status !== '7'"/>
          <el-tag type="error" v-else>已报价失败：{{scope.row.error}}</el-tag>
        </template>
      </el-table-column>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
        <template slot-scope="scope">
          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="handleOffer(scope.row)"
            v-if="scope.row.status === '0'"
            v-hasPermi="['wms:offerOrder:report']"
          >已报价客户</el-button>
          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="handleUpdate(scope.row)"
            v-if="scope.row.status === '3'"
            v-hasPermi="['wms:offerOrder:edit']"
          >完善</el-button>
          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="handleAuditUpdate(scope.row)"
            v-if="scope.row.status === '7'"
            v-hasPermi="['wms:offerOrder:edit']"
          >修改</el-button>
          <el-col :span="1.5">
            <el-button
              type="text"
              icon="el-icon-download"
              size="mini"
              @click="handleExport(scope.row)"
              v-if="scope.row.status === '0'"
              v-hasPermi="['wms:offerOrder:export']"
            >导出</el-button>
          </el-col>
          <el-col :span="1.5">
            <el-button
              type="text"
              icon="el-icon-plus"
              size="mini"
              @click="handleCreateContract(scope.row)"
              v-if="scope.row.status === '0' || scope.row.status === '2'"
              v-hasPermi="['wms:offerOrder:contract']"
            >生成合同</el-button>
          </el-col>
        </template>
      </el-table-column>
    </el-table>

    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />

    <!-- 修改报价单对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="80%" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="130px">
        <el-row :gutter="10">
          <el-col :span="12">
            <el-form-item label="报价单编码" prop="orderCode">
              {{form.orderCode}}
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="是否物流" prop="ifLogistics">
              <el-radio-group v-model="form.ifLogistics" @change="handleIfLogistcsChange">
                <el-radio
                  v-for="dict in dict.type.sys_yes_no"
                  :key="dict.value"
                  :label="dict.value"
                >{{dict.label}}</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="10"  v-if="form.ifLogistics === 'Y'">
          <el-col :span="12">
            <el-form-item label="物流条款" prop="logisticsTermsId">
              <el-select v-model="form.logisticsTermsId" @change="handleTermChange" placeholder="请选择物流条款" clearable>
                <el-option
                  v-for="dict in termList"
                  :key="dict.id"
                  :label="dict.name"
                  :value="dict.id"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="物流方式">
              <el-radio-group v-model="form.logisticsModule">
                <el-radio
                  v-for="dict in dict.type.wms_logistics"
                  :key="dict.value"
                  :label="dict.value"
                >{{dict.label}}</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="10"  v-if="form.ifLogistics === 'Y'">
          <el-col :span="12">
            <el-form-item label="运费" prop="freight">
              <el-input v-model="form.freight" @blur="handleRatio" placeholder="请输入运费" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="保险费" prop="safe">
              <el-input v-model="form.safe" @blur="handleRatio" placeholder="请输入保险费" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="10">
          <el-col :span="12">
            <el-form-item label="杂费" prop="ext">
              <el-input v-model="form.ext" @blur="handleRatio" placeholder="请输入运费" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="订单总额" prop="allPrice">
              <el-input v-model="form.allPrice"  placeholder="请输入订单总额" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="10">
          <el-col :span="12">
            <el-form-item label="交货期" prop="jhValid">
              <el-input placeholder="请输入交货期" v-model="form.jhValid">
                <template slot="append">天</template>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="厂家交货期" prop="jhValid">
              <span v-if="form.cjJhValid">{{form.cjJhValid}}天</span>
              <span v-else>无</span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="10">
          <el-col :span="12">
            <el-form-item label="通知方式" prop="noticeType">
              <el-radio-group v-model="form.noticeType">
                <el-radio
                  v-for="dict in dict.type.wms_order_notice_type"
                  :key="dict.value"
                  :label="dict.value"
                >{{dict.label}}</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="支付方式" prop="payType">
              <el-radio-group v-model="form.payType" @change="handleOfferPayTypeChange">
                <el-radio
                  v-for="dict in dict.type.wms_pay_type"
                  :key="dict.value"
                  :label="dict.value"
                >{{dict.label}}</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="10" v-if="form.payType === '1'">
          <el-col :span="12">
            <el-form-item label="先款比例" prop="prefixPayRate">
              <el-row :gutter="10">
                <el-col :span="11">
                  <el-input v-model="form.prefixPayRate" placeholder="请输入先款比例" />
                </el-col>
                <el-col :span="12">
                  <el-input v-model="form.prefixRemark" :maxlength="255" placeholder="请输入先款备注">
                    <template slot="prepend">备注</template>
                  </el-input>
                </el-col>
              </el-row>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="进度款比例" prop="processPayRate">
              <el-row :gutter="10">
                <el-col :span="11">
                  <el-input v-model="form.processPayRate" placeholder="请输入进度款比例" />
                </el-col>
                <el-col :span="12">
                  <el-input v-model="form.processRemark" :maxlength="255" placeholder="请输入进度款备注">
                    <template slot="prepend">备注</template>
                  </el-input>
                </el-col>
              </el-row>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="10" v-if="form.payType === '1'">
          <el-col :span="12">
            <el-form-item label="尾款比例" prop="tailPayRate">
              <el-row :gutter="10">
                <el-col :span="11">
                  <el-input v-model="form.tailPayRate" placeholder="请输入尾款比例" />
                </el-col>
                <el-col :span="12">
                  <el-input v-model="form.tailRemark" :maxlength="255" placeholder="请输入尾款备注">
                    <template slot="prepend">备注</template>
                  </el-input>
                </el-col>
              </el-row>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item prop="tailPayTime">
              <template slot="label">
                尾款支付时间
                <el-tooltip class="item" effect="dark" content="货到后几天付款，0代表货到立即付款" placement="bottom">
                  <i class="el-icon-warning-outline"></i>
                </el-tooltip>
              </template>
              <el-input v-model="form.tailPayTime" placeholder="请输入货到几天后付款" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="10">
          <el-col :span="12">
            <el-form-item label="利润比例" prop="ratio">
              <el-input v-model="form.ratio" @blur="handleRatio" placeholder="请输入利润比例" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="报价有效期" prop="valid">
              <el-date-picker clearable
                              v-model="form.valid"
                              type="date"
                              value-format="yyyy-MM-dd"
                              placeholder="请选择有效期" style="width: 100%">
              </el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>

        <h1>订单商品</h1>
        <el-table :data="products">
          <el-table-column label="序号" align="center" type="index" width="50"/>
          <el-table-column type="expand">
            <template slot-scope="props">
              <el-form label-position="left" inline class="demo-table-expand">
                <el-row :gutter="10">
                  <el-col :span="12">
                    <el-form-item label="商品编码">
                      <span>{{ props.row.productCode }}</span>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label="商品类型">
                      <span>{{ props.row.productTypeName }}</span>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row :gutter="10">
                  <el-col :span="12">
                    <el-form-item label="生产厂家">
                      <span>{{ props.row.scPurchaseCompanyName }}</span>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label="计数单位">
                      <span>{{ props.row.unitName }}</span>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row :gutter="10">
                  <el-col :span="12">
                    <el-form-item label="尺寸单位">
                      <span>{{ props.row.ccUnitName }}</span>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label="尺寸">
                      <span v-if="props.row.longWith || props.row.weight || props.row.height">{{ props.row.longWith + '*' + props.row.weight + '*' + props.row.height }}</span>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row :gutter="10">
                  <el-col :span="12">
                    <el-form-item label="重量">
                      <span>{{ props.row.zl }}</span>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-form-item label="详情">
                  <span>{{ props.row.detail }}</span>
                </el-form-item>
              </el-form>
            </template>
          </el-table-column>
          <el-table-column label="商品名称" align="center" prop="productName" :show-overflow-tooltip="true"/>
          <el-table-column label="商品型号" align="center" prop="modal" :show-overflow-tooltip="true"/>
          <el-table-column label="商品数量" align="center" prop="productNum"/>
          <el-table-column label="成本" align="center" prop="oldOnlyPrice"/>
          <el-table-column label="单价" align="center">
            <template slot-scope="scope">
              <el-input v-model="scope.row.onlyPrice" @blur="handleOnlyPrice(scope.row)" placeholder="请输入商品单价"/>
            </template>
          </el-table-column>
          <el-table-column label="总价" align="center" prop="allPrice">
            <template slot-scope="scope">
              <el-input v-model="scope.row.allPrice" @blur="handleAllPrice(scope.row)" placeholder="请输入商品总价"/>
            </template>
          </el-table-column>
        </el-table>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm" v-loading="btnLoading">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>

    <!-- 创建合同单对话框 -->
    <el-dialog title="创建合同" :visible.sync="openContract" width="80%" append-to-body>
      <el-form ref="formContract" :model="formContract" :rules="rulesContract" label-width="130px">
        <el-row :gutter="10">
          <el-col :span="12">
            <el-form-item label="报价单编码" >
              {{formContract.offerCode}}
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="是否物流" >
              <dict-tag :options="dict.type.sys_yes_no" :value="formContract.ifLogistics"/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="10"  v-if="formContract.ifLogistics === 'Y'">
          <el-col :span="12">
            <el-form-item label="物流条款">
              {{formContract.logisticsTerms}}
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="物流方式">
              <dict-tag :options="dict.type.wms_logistics" :value="formContract.logisticsModule"/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="10"  v-if="formContract.ifLogistics === 'Y'">
          <el-col :span="12">
            <el-form-item label="运费">
              {{formContract.freight}}
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="保险费">
              {{formContract.safe}}
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="10">
          <el-col :span="12">
            <el-form-item label="杂费">
              {{formContract.ext}}
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="报价有效期">
              {{formContract.valid}}
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="10">
          <el-col :span="12">
            <el-form-item label="厂家交货期">
              <span v-if="formContract.cjJhValid">
                {{formContract.cjJhValid}}天
              </span>
              <span v-else>无</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="报价交货期" prop="jhValid">
              <el-input placeholder="请输入交货期" v-model="formContract.jhValid">
                <template slot="append">天</template>
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="10">
          <el-col :span="12">
            <el-form-item label="利润比例">
              {{formContract.ratio}}
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="报价金额">
              {{allPrice}}
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="10">
          <el-col :span="12">
            <el-form-item label="合同金额" prop="contractPrice">
              <el-input v-model="formContract.contractPrice" placeholder="请输入合同金额" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="支付方式" prop="payType">
              <el-radio-group v-model="formContract.payType" @change="handlePayTypeChange">
                <el-radio
                  v-for="dict in dict.type.wms_pay_type"
                  :key="dict.value"
                  :label="dict.value"
                >{{dict.label}}</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="10" v-if="formContract.payType === '1'">
          <el-col :span="12">
            <el-form-item label="先款比例" prop="prefixPayRate" v-if="formContract.payType === '1'">
              <el-row :gutter="10">
                <el-col :span="11">
                  <el-input v-model="formContract.prefixPayRate" placeholder="请输入先款比例" />
                </el-col>
                <el-col :span="12">
                  <el-input v-model="formContract.prefixRemark" :maxlength="255" placeholder="请输入先款备注">
                    <template slot="prepend">备注</template>
                  </el-input>
                </el-col>
              </el-row>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="进度款比例" prop="processPayRate">
              <el-row :gutter="10">
                <el-col :span="11">
                  <el-input v-model="formContract.processPayRate" placeholder="请输入进度款比例" />
                </el-col>
                <el-col :span="12">
                  <el-input v-model="formContract.processRemark" :maxlength="255" placeholder="请输入进度款备注">
                    <template slot="prepend">备注</template>
                  </el-input>
                </el-col>
              </el-row>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="10" v-if="formContract.payType === '1'">
          <el-col :span="12">
            <el-form-item label="尾款比例" prop="tailPayRate">
              <el-row :gutter="10">
                <el-col :span="11">
                  <el-input v-model="formContract.tailPayRate" placeholder="请输入尾款比例" />
                </el-col>
                <el-col :span="12">
                  <el-input v-model="formContract.tailRemark" :maxlength="255" placeholder="请输入尾款备注">
                    <template slot="prepend">备注</template>
                  </el-input>
                </el-col>
              </el-row>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item prop="tailPayTime">
              <template slot="label">
                尾款支付时间
                <el-tooltip class="item" effect="dark" content="货到后几天付款，0代表货到立即付款" placement="bottom">
                  <i class="el-icon-warning-outline"></i>
                </el-tooltip>
              </template>
              <el-input v-model="formContract.tailPayTime" placeholder="请输入货到几天后付款" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="10">
          <el-col :span="12">
            <el-form-item label="内容数量" >
              {{formContract.productNum}}
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="支付金额" prop="payPrice">
              <el-input v-model="formContract.payPrice" placeholder="请输入支付金额" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="项目描述" prop="detail">
          <el-input
            type="textarea"
            autosize
            placeholder="请输入项目描述"
            v-model="formContract.detail">
          </el-input>
        </el-form-item>

        <el-form-item label="合同附件">
          <el-upload
            class="upload-demo"
            :headers="uploadAccessory.headers"
            :action="uploadAccessory.url"
            :on-remove="handleRemove"
            :on-success="handlePiceSuccess"
            multiple
            accept=".jpg,.png,.jpeg,.pdf"
            :file-list="fileList"
            drag
            style="width: 100%">
            <i class="el-icon-upload"></i>
            <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
            <div class="el-upload__tip text-center" slot="tip">
              <span>仅允许导入jpg/png/pdf格式文件。</span>
            </div>
          </el-upload>
        </el-form-item>

        <el-form-item label="支付附件">
          <el-upload
            class="upload-demo"
            :headers="uploadAccessory.headers"
            :action="uploadAccessory.url"
            :on-remove="handlePayRemove"
            :on-success="handlePaySuccess"
            multiple
            accept=".jpg,.png,.jpeg,.pdf"
            :file-list="payFileList"
            drag
            style="width: 100%">
            <i class="el-icon-upload"></i>
            <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
            <div class="el-upload__tip text-center" slot="tip">
              <span>仅允许导入jpg/png/pdf格式文件。</span>
            </div>
          </el-upload>
        </el-form-item>

        <h1>订单商品</h1>
        <el-table :data="products" @selection-change="handleContractSelectionChange">
          <el-table-column align="center" type="selection" width="50"/>
          <el-table-column type="expand">
            <template slot-scope="props">
              <el-form label-position="left" inline class="demo-table-expand">
                <el-row :gutter="10">
                  <el-col :span="12">
                    <el-form-item label="商品编码">
                      <span>{{ props.row.productCode }}</span>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label="商品类型">
                      <span>{{ props.row.productTypeName }}</span>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row :gutter="10">
                  <el-col :span="12">
                    <el-form-item label="计数单位">
                      <span>{{ props.row.unitName }}</span>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label="尺寸单位">
                      <span>{{ props.row.ccUnitName }}</span>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row :gutter="10">
                  <el-col :span="12">
                    <el-form-item label="尺寸">
                      <span v-if="props.row.longWith || props.row.weight || props.row.height">{{ props.row.longWith + '*' + props.row.weight + '*' + props.row.height }}</span>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label="重量">
                      <span>{{ props.row.zl }}</span>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-form-item label="详情">
                  <span>{{ props.row.detail }}</span>
                </el-form-item>
              </el-form>
            </template>
          </el-table-column>
          <el-table-column label="商品名称" align="center" prop="productName" :show-overflow-tooltip="true"/>
          <el-table-column label="商品型号" align="center" prop="modal" :show-overflow-tooltip="true"/>
          <el-table-column label="生产厂家" align="center" prop="scPurchaseCompanyName"/>
          <el-table-column label="商品数量" align="center" prop="productNum"/>
          <el-table-column label="成本" align="center" prop="oldOnlyPrice"/>
          <el-table-column label="单价" align="center" prop="onlyPrice"/>
          <el-table-column label="总价" align="center" prop="allPrice"/>
        </el-table>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitContractForm" v-loading="btnLoading">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>

    <!-- 上报报价对话框 -->
    <el-dialog title="上报报价" :visible.sync="openReport" width="80%" append-to-body>
      <el-form ref="formReport" :model="form" label-width="100px">
        <el-form-item label="报价单编码" >
          {{form.orderCode}}
        </el-form-item>

        <el-form-item label="证明附件">
          <el-upload
            class="upload-demo"
            :headers="uploadAccessory.headers"
            :action="uploadAccessory.reportUrl"
            :on-remove="handleReportRemove"
            :on-success="handleReportSuccess"
            multiple
            accept=".jpg,.png,.jpeg,.pdf"
            drag
            :file-list="offerFileList">
            <i class="el-icon-upload"></i>
            <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
            <div class="el-upload__tip text-center" slot="tip">
              <span>仅允许导入jpg/png/pdf格式文件。</span>
            </div>
          </el-upload>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitReportOfferForm" v-loading="btnLoading">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>

    <!-- 报价单商品对话框 -->
    <el-dialog title="报价单详情" :visible.sync="openLook" width="80%" append-to-body>
      <el-table :data="orderProductTable">
        <el-table-column label="序号" align="center" type="index" width="50"/>
        <el-table-column type="expand">
          <template slot-scope="props">
            <el-form label-position="left" inline class="demo-table-expand">
              <el-row :gutter="10">
                <el-col :span="12">
                  <el-form-item label="商品编码">
                    <span>{{ props.row.productCode }}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="商品类型">
                    <span>{{ props.row.productTypeName }}</span>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row :gutter="10">
                <el-col :span="12">
                  <el-form-item label="计数单位">
                    <span>{{ props.row.unitName }}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="尺寸单位">
                    <span>{{ props.row.ccUnitName }}</span>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row :gutter="10">
                <el-col :span="12">
                  <el-form-item label="尺寸">
                    <span v-if="props.row.longWith || props.row.weight || props.row.height">{{ props.row.longWith + '*' + props.row.weight + '*' + props.row.height }}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="重量">
                    <span>{{ props.row.zl }}</span>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-form-item label="详情">
                <span>{{ props.row.detail }}</span>
              </el-form-item>
            </el-form>
          </template>
        </el-table-column>
        <el-table-column label="商品名称" align="center" prop="productName" :show-overflow-tooltip="true"/>
        <el-table-column label="商品型号" align="center" prop="modal" :show-overflow-tooltip="true"/>
        <el-table-column label="生产厂家" align="center" prop="scPurchaseCompanyName"  :show-overflow-tooltip="true"/>
        <el-table-column label="商品数量" align="center" prop="productNum"/>
        <el-table-column label="成本" align="center" prop="oldOnlyPrice"/>
        <el-table-column label="单价" align="center" prop="onlyPrice"/>
        <el-table-column label="总价" align="center" prop="allPrice"/>
      </el-table>
    </el-dialog>
  </div>
</template>

<script>
import {
  listOfferOrder,
  getOfferOrder,
  updateOfferOrder,
  createContract,
  reportOffer,
  getAuditOfferOrder
} from '@/api/wms/offerOrder'
import {getOrderProduct} from "@/api/wms/inquireOrder";
import {getToken} from "@/utils/auth";
import {listTermsXlk} from "@/api/wms/terms";
import {listProcessXlk} from "@/api/wms/process";

export default {
  name: "OfferOrder",
  dicts: ['wms_logistics','sys_yes_no', 'wms_logistics_order_status','wms_pay_type', 'wms_order_notice_type'],
  data() {
    let checkPayRate =(rule, value, callback) =>{
      let curRate = parseFloat(this.formContract.prefixPayRate) + parseFloat(this.formContract.processPayRate)
        + parseFloat(this.formContract.tailPayRate)
      if (curRate > 1) {
        return callback(new Error('先款进度款尾款总额不能大于1'));
      } else {
        callback()
      }
    }
    return {
      checkPayRate: checkPayRate,
      //按钮加载
      btnLoading: false,
      // 遮罩层
      loading: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 报价单表格数据
      offerOrderList: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      // 订单详情弹出层
      openLook: false,
      // 创建合同弹出层
      openContract: false,
      // 上报报价弹出层
      openReport: false,
      // 附件参数
      uploadAccessory: {
        // 设置上传的请求头部
        headers: { Authorization: "Bearer " + getToken() },
        // 上传的地址
        url: process.env.VUE_APP_BASE_API + "/wms/contractOrder/uploadPic",
        reportUrl: process.env.VUE_APP_BASE_API + "/wms/offerOrder/uploadPic"
      },
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        orderCode: null,
        inquireCode: null,
        priceComparisonCode: null,
        logisticsTermsId: null,
        logisticsModule: null,
        status: null,
        ifLogistics: null
      },
      // 表单参数
      form: {},
      // 表单校验
      rules: {
        valid: [
          { required: true, message: "请选择报价有效期", trigger: "blur" }
        ],
        jhValid: [
          { required: true, message: "请输入交货期", trigger: "blur" },
          { pattern: /^(0|[1-9])\d{0,4}$/, message: '交货期只能是数值最多5位数', trigger: 'blur' }
        ],
        ratio: [
          { pattern: /^(0|[1-9])\d{0,1}(\.\d{0,2})?$/, message: '利润比例只能是数值最大2位整数2位小数', trigger: 'blur' }
        ],
        allPrice: [
          { required: true, message: "请输入订单总额", trigger: "blur" },
          { pattern: /^(0|[1-9])\d{0,6}(\.\d{0,2})?$/, message: '订单总额只能是数值最大7位整数2位小数', trigger: 'blur' }
        ],
        freight: [
          { pattern: /^(0|[1-9])\d{0,6}(\.\d{0,2})?$/, message: '运费只能是数值最大7位整数2位小数', trigger: 'blur' }
        ],
        safe: [
          { pattern: /^(0|[1-9])\d{0,6}(\.\d{0,2})?$/, message: '保险费只能是数值最大7位整数2位小数', trigger: 'blur' }
        ],
        ext: [
          { pattern: /^(0|[1-9])\d{0,6}(\.\d{0,2})?$/, message: '杂费只能是数值最大7位整数2位小数', trigger: 'blur' }
        ],
        prefixPayRate: [
          { required: true, message: "先款不可为空", trigger: "blur" },
          { pattern: /^(1|(0(\.\d)?))$/, message: '先款比例只能是数值最大为1或小于1的1位小数', trigger: 'blur' },
          { required: true,validator:checkPayRate, trigger: 'blur' }
        ],
        processPayRate: [
          { required: true, message: "进度款不可为空", trigger: "blur" },
          { pattern: /^(1|(0(\.\d)?))$/, message: '进度款比例只能是数值最大为1或小于1的1位小数', trigger: 'blur' },
          { required: true,validator:checkPayRate, trigger: 'blur' }
        ],
        tailPayRate: [
          { required: true, message: "尾款不可为空", trigger: "blur"},
          { pattern: /^(1|(0(\.\d)?))$/, message: '尾款比例只能是数值最大为1或小于1的1位小数', trigger: 'blur' },
          { required: true,validator:checkPayRate, trigger: 'blur'}
        ],
        tailPayTime: [
          { required: true, message: "尾款支付时间不可为空", trigger: "blur" },
          { pattern: /^([0|[1-9]{1,3})$/, message: '尾款支付时间只能是整数最大999', trigger: 'blur' }
        ]
      },
      // 合同表单参数
      formContract: {},
      // 合同表单校验
      rulesContract: {
        detail: [
          { max: 255, message: '项目描述最多255个字符', trigger: 'blur' }
        ],
        jhValid: [
          { required: true, message: "请输入交货期", trigger: "blur" },
          { pattern: /^(0|[1-9])\d{0,4}$/, message: '交货期只能是数值最多5位数', trigger: 'blur' }
        ],
        payPrice: [
          { required: true, message: "支付金额不可为空", trigger: "blur" },
          { pattern: /^(0|[1-9])\d{0,6}(\.\d{0,2})?$/, message: '支付金额只能是数值最大7位整数2位小数', trigger: 'blur' }
        ],
        contractPrice: [
          { required: true, message: "合同金额不可为空", trigger: "blur" },
          { pattern: /^(0|[1-9])\d{0,6}(\.\d{0,2})?$/, message: '合同金额只能是数值最大7位整数2位小数', trigger: 'blur' }
        ],
        prefixPayRate: [
          { required: true, message: "先款不可为空", trigger: "blur" },
          { pattern: /^(1|(0(\.\d)?))$/, message: '先款比例只能是数值最大为1或小于1的1位小数', trigger: 'blur' },
          { required: true,validator:checkPayRate, trigger: 'blur' }
        ],
        processPayRate: [
          { required: true, message: "进度款不可为空", trigger: "blur" },
          { pattern: /^(1|(0(\.\d)?))$/, message: '进度款比例只能是数值最大为1或小于1的1位小数', trigger: 'blur' },
          { required: true,validator:checkPayRate, trigger: 'blur' }
        ],
        tailPayRate: [
          { required: true, message: "尾款不可为空", trigger: "blur"},
          { pattern: /^(1|(0(\.\d)?))$/, message: '尾款比例只能是数值最大为1或小于1的1位小数', trigger: 'blur' },
          { required: true,validator:checkPayRate, trigger: 'blur'}
        ],
        tailPayTime: [
          { required: true, message: "尾款支付时间不可为空", trigger: "blur" },
          { pattern: /^([0|[1-9]{1,3})$/, message: '尾款支付时间只能是整数最大999', trigger: 'blur' }
        ]
      },
      // 订单商品
      orderProductTable: [],
      //条款下拉框
      termList: [],
      //附件列表
      offerAccessoryList: [],
      //附件列表
      accessoryList: [],
      //支付附件列表
      payAccessoryList: [],
      offerFileList: [],
      fileList: [],
      payFileList: [],
      //商品信息
      products: [],
      //选择的商品
      selectedProduct: [],
      //流程列表
      processList: [],
      allPrice: 0
    };
  },
  created() {
    this.getList();
    this.getTermList();
    this.getProcessList();
  },
  methods: {
    /** 查询报价单列表 */
    getList() {
      this.loading = true;
      listOfferOrder(this.queryParams).then(response => {
        this.offerOrderList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },
    /** 查询条款列表 */
    getTermList() {
      listTermsXlk().then(response => {
        this.termList = response.data;
      });
    },
    /** 查询流程列表 */
    getProcessList() {
      listProcessXlk().then(response => {
        this.processList = response.data;
      });
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.openContract = false;
      this.openReport = false;
      this.reset();
    },
    // 表单重置
    reset() {
      this.offerAccessoryList = []
      this.accessoryList = []
      this.payAccessoryList=[]
      this.selectedProduct = []
      this.offerFileList = []
      this.fileList = []
      this.payFileList = []
      this.products = []
      this.allPrice = 0
      this.form = {
        orderCode: null,
        inquireCode: null,
        priceComparisonCode: null,
        offerTime: null,
        logisticsTermsId: null,
        logisticsTerms: null,
        logisticsModule: null,
        ifLogistics: null,
        ratio: null,
        freight: null,
        safe: null,
        ext: null,
        jhValid: null,
        allPrice: null,
        prefixPayRate: 0,
        processPayRate: 0,
        tailPayRate: 0,
        tailPayTime: 0,
        payType: '1',
        prefixRemark: null,
        processRemark: null,
        tailRemark: null,
        noticeType: '0',
      };
      this.formContract = {
        inquireCode: null,
        offerCode: null,
        contractPrice: null,
        productNum: 0,
        payType: '1',
        logisticsTerms: null,
        logisticsTermsId: null,
        logisticsModule: "0",
        ifLogistics: 'Y',
        freight: null,
        safe: null,
        ext: null,
        allPrice: null,
        jhValid: null,
        prefixPayRate: 0,
        processPayRate: 0,
        tailPayRate: 0,
        tailPayTime: 0,
        payPrice: 0,
        prefixRemark: null,
        processRemark: null,
        tailRemark: null,
        cjJhValid: null
      };
      this.resetForm("form");
      this.resetForm("formContract");
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset();
      const orderCode = row.orderCode
      getOfferOrder(orderCode).then(response => {
        this.form = response.data;
        if (!this.form.payType) {
          this.form.payType = '1'
          this.form.prefixPayRate = 0
          this.form.processPayRate = 0
          this.form.tailPayRate = 0
          this.form.tailPayTime = 0
        }
        if (!this.form.noticeType) {
          this.form.noticeType = '0'
        }
        if (!this.form.ifLogistics) {
          this.form.ifLogistics = 'Y'
          this.form.logisticsModule = '0'
        }
        this.handleOfferPayTypeChange(this.form.payType)

        this.products = this.form.products;

        if (!this.form.allPrice) {
          let allPrice = 0
          this.products.forEach(item => {
            allPrice += parseFloat(item.allPrice);
          })
          this.form.allPrice = allPrice.toFixed(2)
        }

        this.open = true;
        this.title = "修改报价单";
      });
    },
    /** 修改按钮操作 */
    handleAuditUpdate(row) {
      this.reset();
      const orderCode = row.orderCode
      getAuditOfferOrder(orderCode).then(response => {
        this.form = response.data;
        this.handleOfferPayTypeChange(this.form.payType)

        this.products = this.form.products;

        this.open = true;
        this.title = "修改报价单";
      });
    },
    /** 已报价客户按钮操作 */
    handleOffer(row) {
      this.reset();
      this.form.orderCode = row.orderCode;
      this.openReport = true;
    },
    /** 生成合同按钮操作 */
    handleCreateContract(row) {
      this.reset();
      const orderCode = row.orderCode
      getOfferOrder(orderCode).then(response => {
        let data = response.data;
        this.formContract.inquireCode = data.inquireCode;
        this.formContract.offerCode = data.orderCode;
        this.formContract.logisticsTerms = data.logisticsTerms;
        this.formContract.logisticsTermsId = data.logisticsTermsId;
        this.formContract.logisticsModule = data.logisticsModule;
        this.formContract.ifLogistics = data.ifLogistics;
        this.formContract.ratio = data.ratio;
        this.formContract.valid = data.valid;
        this.formContract.jhValid = data.jhValid;
        this.formContract.cjJhValid = data.cjJhValid;
        this.formContract.ext = data.ext;
        this.formContract.safe = data.safe;
        this.formContract.freight = data.freight;
        this.formContract.payType = data.payType;
        this.formContract.tailPayTime = data.tailPayTime;
        this.formContract.tailPayRate = data.tailPayRate;
        this.formContract.processPayRate = data.processPayRate;
        this.formContract.prefixPayRate = data.prefixPayRate;
        this.formContract.tailRemark = data.tailRemark;
        this.formContract.processRemark = data.processRemark;
        this.formContract.prefixRemark = data.prefixRemark;
        this.products = data.products;
        let allPrice = 0
        this.products.forEach(item => {
          allPrice += parseFloat(item.allPrice);
        })
        this.allPrice = allPrice.toFixed(2)
        this.openContract = true;
      });
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          let msg = ''
          let reg = /^(0|[1-9])\d{0,6}(\.\d{0,2})?$/
          for (let i = 0; i < this.products.length; i++) {
            let item = this.products[i];
            if (item.onlyPrice) {
              if (!reg.test(item.onlyPrice)) {
                msg += "第" + (i+1) +"行格式异常，商品单价只能是数值最大7位整数2位小数；"
              } else {
                if(parseFloat(item.onlyPrice) < parseFloat(item.oldOnlyPrice)){
                  msg += "第" + (i+1) +"行格式异常，商品单价不能小于成本；"
                }
              }
            } else {
              msg += "第" + (i+1) +"行格式异常，商品单价不能为空；"
            }
            if (item.allPrice) {
              if (!reg.test(item.allPrice)) {
                msg += "第" + (i+1) +"行格式异常，商品总价只能是数值最大7位整数2位小数；"
              }
            } else {
              msg += "第" + (i+1) +"行格式异常，商品总价不能为空；"
            }
          }

          if (msg) {
            this.$message.error(msg)
          } else {
              if (this.form.payType === '0') {
                this.form.prefixPayRate = 1
              }
              let curRate = parseFloat(this.form.prefixPayRate) + parseFloat(this.form.processPayRate)
                + parseFloat(this.form.tailPayRate);
              if (curRate == 1) {
                this.btnLoading = true
                this.form.products = this.products
                if (this.form.ratio) {
                  let ratio = parseFloat(this.form.ratio) + 1
                  if (this.form.freight) {
                    this.form.freight = (parseFloat(this.form.freight) * ratio).toFixed(2)
                  }
                  if (this.form.ext) {
                    this.form.ext = (parseFloat(this.form.ext) * ratio).toFixed(2)
                  }
                  if (this.form.safe) {
                    this.form.safe = (parseFloat(this.form.safe) * ratio).toFixed(2)
                  }
                }
                updateOfferOrder(this.form).then(response => {
                  this.$modal.msgSuccess("修改成功");
                  this.open = false;
                  this.getList();
                }).finally(f => {
                  this.btnLoading = false
                });
              } else {
                this.$message.error("先款、进度款、尾款总额必须等于1！")
              }
          }
        }
      });
    },
    /** 导出按钮操作 */
    handleExport(row) {
      this.download('wms/offerOrder/export?orderCode=' + row.orderCode, {}, `报价单_${row.orderCode}.xlsx`)
    },
    // 查看订单商品
    handleLook(row){
      this.orderProductTable = []
      getOrderProduct({orderCode: row.orderCode}).then(response => {
        this.openLook = true
        this.orderProductTable = response.data
      })
    },
    // 是否物流变更事件
    handleIfLogistcsChange(val) {
      if (val === 'Y'){
        this.form.logisticsModule = '0'
      } else {
        this.form.logisticsTermsId = null
        this.form.logisticsModule = null
        this.form.freight = null
        this.form.safe = null
      }
      this.handleRatio()
    },
    // 物流条款变更事件
    handleTermChange(val) {
      if (val){
        let term = this.termList.filter(item => item.id === val)
        this.form.logisticsTerms = term[0].name
      } else {
        this.form.logisticsTerms = null
      }
    },
    //利率失去焦点事件
    handleRatio(){
      let val = this.form.ratio
      if (val != null && val != undefined && val != "") {
        let reg = /^(0|[1-9])\d{0,2}(\.\d{0,2})?$/
        if (reg.test(val)) {
          let allPrice = 0
          this.products.forEach(item => {
            if (item.allPrice) {
              item.allPrice = (parseFloat(item.oldAllPrice) + parseFloat(item.oldAllPrice) * parseFloat(val)).toFixed(2)
              allPrice += parseFloat(item.allPrice)
            }
            if (item.onlyPrice) {
              item.onlyPrice = (parseFloat(item.oldOnlyPrice) + parseFloat(item.oldOnlyPrice) * parseFloat(val)).toFixed(2)
            }
          })

          let freight = parseFloat(this.form.freight ? this.form.freight : 0)
          let safe = parseFloat(this.form.safe ? this.form.safe : 0)
          let ext = parseFloat(this.form.ext ? this.form.ext : 0)
          let price = ext + freight + safe
          this.form.allPrice = (allPrice + price + (price * parseFloat(val))).toFixed(2)
        }
      } else {
        let allPrice = 0
        this.products.forEach(item => {
          if (item.allPrice) {
            item.allPrice = parseFloat(item.oldAllPrice).toFixed(2)
            allPrice += parseFloat(item.allPrice)
          }
          if (item.onlyPrice) {
            item.onlyPrice = parseFloat(item.oldOnlyPrice).toFixed(2)
          }
          // this.allPrice = allPrice
        })

        let freight = parseFloat(this.form.freight ? this.form.freight : 0)
        let safe = parseFloat(this.form.safe ? this.form.safe : 0)
        let ext = parseFloat(this.form.ext ? this.form.ext : 0)
        this.form.allPrice = (allPrice + ext + freight + safe).toFixed(2)

      }
    },
    //单价失去焦点事件
    handleOnlyPrice(row){
      if (row.onlyPrice) {
        let reg = /^(0|[1-9])\d{0,6}(\.\d{0,2})?$/
        if (!reg.test(row.onlyPrice)) {
          this.$notify.error("商品单价只能是数值，最大7位整数2位小数")
        } else {
          if (parseFloat(row.onlyPrice) < parseFloat(row.oldOnlyPrice)) {
            this.$alert('商品单价不能小于成本', '警告', {
              confirmButtonText: '确定',
              callback: action => {
                let onlyPrice = parseFloat(row.oldOnlyPrice).toFixed(2)
                row.allPrice = (row.productNum * onlyPrice).toFixed(2)
                row.onlyPrice = onlyPrice

                let allPrice = this.allPrice
                if (allPrice === null || allPrice === undefined) {
                  allPrice = 0
                }
                if (row.oldAllPrice != null && row.oldAllPrice != undefined) {
                  allPrice -= row.oldAllPrice
                }
                row.oldAllPrice = row.allPrice

                this.allPrice = (parseFloat(allPrice) + parseFloat(row.allPrice)).toFixed(2)
              }
            });
          } else {
            row.allPrice = (row.productNum * row.onlyPrice).toFixed(2)

            let allPrice = this.allPrice
            if (allPrice === null || allPrice === undefined) {
              allPrice = 0
            }
            if (row.oldAllPrice != null && row.oldAllPrice != undefined) {
              allPrice -= row.oldAllPrice
            }
            row.oldAllPrice = row.allPrice

            this.allPrice = (parseFloat(allPrice) + parseFloat(row.allPrice)).toFixed(2)
          }
        }
      } else {
        let fAllPrice = this.allPrice
        let allPrice = row.allPrice
        if (fAllPrice !== null && fAllPrice !== undefined) {
          if (allPrice !==null && allPrice !== undefined) {
            this.allPrice = (parseFloat(fAllPrice) - parseFloat(allPrice)).toFixed(2)
          }
        }
        if (allPrice !== null && allPrice !== undefined) {
          row.allPrice = null
          row.oldAllPrice = null
        }
      }
    },
    //总价失去焦点事件
    handleAllPrice(row){
      if (row.allPrice !== null && row.allPrice !== undefined) {
        let reg = /^(0|[1-9])\d{0,6}(\.\d{0,2})?$/
        if (!reg.test(row.allPrice)) {
          this.$notify.error("商品总价只能是数值，最大7位整数2位小数")
        } else {
          let allPrice = this.allPrice
          if (allPrice === null || allPrice === undefined) {
            allPrice = 0
          }

          if (row.oldAllPrice !== null && row.oldAllPrice !== undefined) {
            allPrice = parseFloat(allPrice) - parseFloat(row.oldAllPrice)
          }
          this.allPrice = (parseFloat(allPrice) + parseFloat(row.allPrice)).toFixed(2)
          row.oldAllPrice = row.allPrice
        }
      } else {
        let allPrice = this.allPrice
        if (allPrice !== null && allPrice !== undefined) {
          if (row.oldAllPrice !== null && row.oldAllPrice !== undefined) {
            allPrice = parseFloat(allPrice) - parseFloat(row.oldAllPrice)
          }
          this.allPrice = parseFloat(allPrice).toFixed(2)
        }
        row.oldAllPrice = null
      }
    },
    // 选择商品
    handleContractSelectionChange(selection) {
      this.selectedProduct = selection
      this.formContract.contractPrice = parseFloat(0)
      selection.forEach(item => {
        this.formContract.contractPrice += parseFloat(item.allPrice)
      })
      this.formContract.productNum = selection.length
    },
    /** 提交合同按钮 */
    submitContractForm() {
      this.$refs["formContract"].validate(valid => {
        if (valid) {
          if (this.selectedProduct.length > 0) {
            if (this.accessoryList.length > 0) {
              if (this.payAccessoryList.length > 0 || (this.formContract.prefixPayRate == 0 && this.formContract.payType === '1')) {
                if (this.formContract.payType === '0') {
                  this.formContract.prefixPayRate = 1
                }
                let curRate = parseFloat(this.formContract.prefixPayRate) + parseFloat(this.formContract.processPayRate)
                  + parseFloat(this.formContract.tailPayRate);
                if (curRate == 1) {
                  this.btnLoading = true
                  this.formContract.products = this.selectedProduct
                  this.formContract.accessoryList = this.accessoryList
                  this.formContract.payAccessoryList = this.payAccessoryList
                  createContract(this.formContract).then(response => {
                    this.$modal.msgSuccess("合同创建成功，等待审核");
                    this.openContract = false;
                    this.getList();
                  }).finally(f => {
                    this.btnLoading = false
                  });
                } else {
                  this.$message.error("先款、进度款、尾款总额必须等于1！")
                }
              } else {
                this.$message.error("请上传支付附件！")
              }
            } else {
              this.$message.error("请上传合同附件！")
            }
          } else {
            this.$message.error("请选择合同商品！")
          }
        }
      })
    },
    /** 提交上报报价按钮 */
    submitReportOfferForm() {
      if (this.offerAccessoryList.length > 0) {
        this.btnLoading = true
        this.form.accessoryList = this.offerAccessoryList
        reportOffer(this.form).then(response => {
          this.$modal.msgSuccess("报价上报成功，等待审核");
          this.openReport = false;
          this.getList();
        }).finally(f => {
          this.btnLoading = false
        });
      } else {
        this.$message.error("请上传证明附件！")
      }
    },
    handleRemove(file, fileList) {
      this.accessoryList.splice(this.accessoryList.indexOf(file.url), 1);
    },
    // 附件上传成功处理
    handlePiceSuccess(response, file, fileList) {
      if (response.code == 200) {
        this.accessoryList.push(response.imgUrl)
      }
    },
    handleReportRemove(file, fileList) {
      this.offerAccessoryList.splice(this.offerAccessoryList.indexOf(file.url), 1);
    },
    // 附件上传成功处理
    handleReportSuccess(response, file, fileList) {
      if (response.code == 200) {
        this.offerAccessoryList.push(response.imgUrl)
      }
    },
    handlePayRemove(file, fileList) {
      this.payAccessoryList.splice(this.payAccessoryList.indexOf(file.url), 1);
    },
    // 附件上传成功处理
    handlePaySuccess(response, file, fileList) {
      if (response.code == 200) {
        this.payAccessoryList.push(response.imgUrl)
      }
    },
    // 合同支付类型变更事件
    handlePayTypeChange(val) {
      if (val === '1') {
        this.rulesContract.prefixPayRate = [
          { required: true, message: "先款不可为空", trigger: "blur" },
          { pattern: /^(1|(0(\.\d)?))$/, message: '先款比例只能是数值最大为1或小于1的1位小数', trigger: 'blur' },
          { required: true,validator:this.checkPayRate, trigger: 'blur' }
        ]
        this.rulesContract.processPayRate = [
          { required: true, message: "进度款不可为空", trigger: "blur" },
          { pattern: /^(1|(0(\.\d)?))$/, message: '进度款比例只能是数值最大为1或小于1的1位小数', trigger: 'blur' },
          { required: true,validator:this.checkPayRate, trigger: 'blur' }
        ]
        this.rulesContract.tailPayRate = [
          { required: true, message: "尾款不可为空", trigger: "blur" },
          { pattern: /^(1|(0(\.\d)?))$/, message: '尾款比例只能是数值最大为1或小于1的1位小数', trigger: 'blur' },
          { required: true,validator:this.checkPayRate, trigger: 'blur' }
        ]
        this.rulesContract.tailPayTime = [
          { required: true, message: "尾款支付时间不可为空", trigger: "blur" },
          { pattern: /^([0|[1-9]{1,3})$/, message: '尾款支付时间只能是整数最大999', trigger: 'blur' }
        ]
      } else {
        this.rulesContract.prefixPayRate = []
        this.rulesContract.processPayRate = []
        this.rulesContract.tailPayRate = []
        this.rulesContract.tailPayTime = []
      }
    },
    // 报价支付类型变更事件
    handleOfferPayTypeChange(val) {
      if (val === '1') {
        this.rules.prefixPayRate = [
          { required: true, message: "先款不可为空", trigger: "blur" },
          { pattern: /^(1|(0(\.\d)?))$/, message: '先款比例只能是数值最大为1或小于1的1位小数', trigger: 'blur' },
          { required: true,validator:this.checkPayRate, trigger: 'blur' }
        ]
        this.rules.processPayRate = [
          { required: true, message: "进度款不可为空", trigger: "blur" },
          { pattern: /^(1|(0(\.\d)?))$/, message: '进度款比例只能是数值最大为1或小于1的1位小数', trigger: 'blur' },
          { required: true,validator:this.checkPayRate, trigger: 'blur' }
        ]
        this.rules.tailPayRate = [
          { required: true, message: "尾款不可为空", trigger: "blur" },
          { pattern: /^(1|(0(\.\d)?))$/, message: '尾款比例只能是数值最大为1或小于1的1位小数', trigger: 'blur' },
          { required: true,validator:this.checkPayRate, trigger: 'blur' }
        ]
        this.rules.tailPayTime = [
          { required: true, message: "尾款支付时间不可为空", trigger: "blur" },
          { pattern: /^([0|[1-9]{1,3})$/, message: '尾款支付时间只能是整数最大999', trigger: 'blur' }
        ]
      } else {
        this.rules.prefixPayRate = []
        this.rules.processPayRate = []
        this.rules.tailPayRate = []
        this.rules.tailPayTime = []
      }
    },
  }
};
</script>
<style scoped>
/deep/ .el-select{
  width: 100%;
}
</style>
